
{extend name='public/layout'/}
<!-- 本页面要使用的css开始 -->
{block name='css'}
<link rel="stylesheet" type="text/css" href="__STATIC__/api/css/voucher.css?v={:time()}" />
{/block}
<!-- 本页面要使用的css结束 -->
<!-- 本页面要使用的js开始 -->
{block name='js'}
<script src="__STATIC__/api/js/voucher.js" type="text/javascript" charset="utf-8"></script>
{/block}
<!-- 本页面要使用的js结束 -->

<!-- 页面主体开始 -->
{block name='app'}
<div class="banner">
	<div class="wrap">
		<img :src="voucher.banner" alt="">
	</div>
</div>

<ul class="voucher-nav">
	<li 
		v-for="(item,index) in items"
		:class="{active : index===curId}"
		 @click="tab(index)"
	>
		{{item.item}}</li>
	
</ul>
<div class="voucher-list" v-if="curId === 0">
	<div class="wrap">
		<div class="voucher-none" v-if="voucher.count1 == 0">
			<img src="__STATIC__/api/images/noVoucher.png" alt="">
			<p>暂无优惠券</p>
		</div>
		<ul v-else>
			<li 
			class="clearfix" 
			v-for="(item,index) in voucher.list1"
			>
				<div class="voucher-money fl">
					<p class="p1"><span>￥</span>{{item.cashcard_price}}</p>
					<p class="p2">{{item.cate_name}}</p>
				</div>
				<div class="voucher-name fl">
					<p class="p1">{{item.title}}</p>
					<p class="p2">{{item.expire_at}}到期</p>
					<p class="p2" v-if="item.min_order_price==0">无门槛</p>
					<p class="p2" v-else>满{{item.min_order_price}}可用</p>
				</div>
				<div class="voucher-button fl">
					<a @click="goDetail(item.id)">查看详情</a>
				</div>
			</li>
		</ul>
	</div>
</div>
<div class="voucher-list voucher-list2"  v-if="curId === 1">
	<div class="wrap">
		<div class="voucher-none" v-if="voucher.count2 == 0">
			<img src="__STATIC__/api/images/noVoucher.png" alt="">
			<p>暂无优惠券</p>
		</div>
		<ul v-else>
			<li 
			class="clearfix" 
			v-for="(item,index) in voucher.list2"
			>
				<div class="voucher-money fl">
					<p class="p1"><span>￥</span>{{item.cashcard_price}}</p>
					<p class="p2">{{item.cate_name}}</p>
				</div>
				<div class="voucher-name fl">
					<p class="p1">{{item.title}}</p>
					<p class="p2">{{item.expire_at}}到期</p>
					<p class="p2" v-if="item.min_order_price==0">无门槛</p>
					<p class="p2" v-else>满{{item.min_order_price}}可用</p>
				</div>
				<div class="voucher-button2  fl">
					<img src="__STATIC__/api/images/overdue.png" >
				</div>
			</li>
		</ul>
	</div>
</div>
<div class="voucher-list voucher-list2"  v-if="curId === 2">
	<div class="wrap">
		<div class="voucher-none" v-if="voucher.count3 == 0">
			<img src="__STATIC__/api/images/noVoucher.png" alt="">
			<p>暂无优惠券</p>
		</div>
		<ul v-else>
			<li 
			class="clearfix" 
			v-for="(item,index) in voucher.list3"
			>
				<div class="voucher-money fl">
					<p class="p1"><span>￥</span>{{item.cashcard_price}}</p>
					<p class="p2">{{item.cate_name}}</p>
				</div>
				<div class="voucher-name fl">
					<p class="p1">{{item.title}}</p>
					<p class="p2">{{item.expire_at}}到期</p>
					<p class="p2" v-if="item.min_order_price==0">无门槛</p>
					<p class="p2" v-else>满{{item.min_order_price}}可用</p>
				</div>
				<div class="voucher-button2 fl">
					<img src="__STATIC__/api/images/used.png" alt="">
				</div>
			</li>
		</ul>
	</div>
</div>
{include file='public/copyright' /}
{/block}
<!-- 页面主体结束 -->
